let wenshiId = null;
let operation = null;
let requestUrl = null;
let wenshi_location = null;
let chongwu_location = null;
let url = "/images/blank.png";

/**
 * 统御状态
 */
let states = ["未统御", "统御中"];
/**
 * 开启状态
 */
let stateArray = ["未开启", "已开启"];
let inlayArray = ["&emsp;&emsp;镶嵌&emsp;&emsp;", "&emsp;&emsp;取下&emsp;&emsp;"];
let takeArray = ["&emsp;&emsp;骑乘&emsp;&emsp;", "&emsp;&emsp;下骑&emsp;&emsp;"];
let tongyuArray = [
	"&emsp;&emsp;统御召唤灵&emsp;&emsp;",
	"&emsp;&emsp;取消统御&emsp;&emsp;",
	"&emsp;&emsp;更换统御&emsp;&emsp;"
];

function addHandler() {
	let roleId = $("#role_id").combobox("getValue");

	if (roleId) {
		$("#roleId").combobox("setValue", roleId);
	}

	requestUrl = "/zuoqi/insert";

	$("#zuoqi_dialog").dialog("open");
}

function editHandler() {
	let rowData = $("#zuoqi_list").datagrid("getSelected");

	if(rowData) {
		requestUrl = "/zuoqi/updateById";

		$("#id").val(rowData.id);
		$("#name").textbox("setValue", rowData.name);
		$("#roleId").combobox("setValue", rowData.roleId);
		$("#openStatus").combobox("setValue", rowData.openStatus);
		$("#categoryId").combobox("setValue", rowData.categoryId);

		$("#zuoqi_dialog").dialog("open");
	} else {
		alertMsg("请选择要修改的记录！");
	}
}

function deleteHandler() {
	let rowData = $("#zuoqi_list").datagrid("getSelected");

	if(rowData) {
		$.messager.confirm("提示", "是否确认删除？", function(bool) {
			if (bool) {
				ajaxPost("/zuoqi/deleteById", {
					id: rowData.id
				}, function(resp) {
					showMsg(resp.message);

					$("#zuoqi_list").datagrid("reload");
				}, error);
			}
		});
	} else {
		alertMsg("请选择要删除的记录！");
	}
}

function detailHandler() {
	let rowData = $("#zuoqi_list").datagrid("getSelected");

	if(rowData) {
		$("#zuoqi_datalist").datalist("reload", {
			callback: function () {
				$("#zuoqi_datalist").datalist("selectRecord", rowData.id);
			}
		});

		$("#zuoqi_detail").dialog("open");
	} else {
		unselected();
	}
}

/**
 * 选中坐骑数据表格zuoqi_datalist时触发的数据加载操作
 * @param zuoqiId 坐骑id
 */
function loadBeforeView(zuoqiId) {
	loadWenshi(zuoqiId);
	loadSkill(zuoqiId);
	loadChongwu(zuoqiId);
}

/**
 * 加载坐骑镶嵌的纹饰
 * @param zuoqiId 坐骑ID
 */
function loadWenshi(zuoqiId) {
	$("#list").empty();

	// 通过坐骑ID查询纹饰类型的图片
	ajaxGet("/wenshi/selectByZuoqiId", {
		zuoqiId: zuoqiId
	}, function(resp) {
		let list = resp.data;

		$("#wenshi_1").prop("src", url);
		$("#wenshi_2").prop("src", url);
		$("#wenshi_3").prop("src", url);

		if(list && list.length > 0) {
			for(let i = 0; i< list.length; i++) { // 加载纹饰
				let data = list[i];

				$("#wenshi_" + data.location).attr({
					"title": data.name,
					"src": data.image,
					"ref": data.id
				});
			}

			// 查询纹饰属性
			ajaxGet("/wenshi_attribute/selectByZuoqiId", {
				zuoqiId: zuoqiId
			}, function(resp) {
				let data = resp.data;

				if(data && data.length > 0) {
					let content = "";

					// 加载纹饰
					for(let i = 0; i < data.length; i++) {
						content += "<span>" + data[i] + "</span>";

						if (i < data.length - 1) {
							content += "<br/>";
						}
					}

					$("#list").append(content);
				}
			}, error);
		}
	}, error);
}

/**
 * 加载坐骑技能
 * @param zuoqiId 坐骑ID
 */
function loadSkill(zuoqiId) {
	$("#skill").attr("src", url);
	$("#skill_name").html("");

	if (zuoqiId) {
		// 通过坐骑ID查询坐骑技能类型名称和图标
		ajaxGet("/zuoqi_skill/selectByZuoqiId", {
			zuoqiId: zuoqiId
		}, function (resp) {
			let data = resp.data;

			if (data) {
				ajaxGet("/zuoqi_skill_category/selectById", {
					id: data.skillId
				}, function (resp) {
					let result = resp.data;

					$("#skill").attr("src", result.image).tooltip({
						content: "<span class='white'>" + result.name + "：" + result.note + "</span>",
						onShow: function() {
							$(this).tooltip("tip").css({
								backgroundColor: "#666",
								borderColor: "#666"
							});
						}
					});

					$("#skill_name").html(result.name);
				}, error);
			}
		}, error);
	}
}

/**
 * 加载坐骑统御的宠物
 * @param zuoqiId
 */
function loadChongwu(zuoqiId) {
	$("#chongwu_1").attr("src", url);
	$("#chongwu_2").attr("src", url);

	// 通过坐骑ID查询统御的宠物列表
	ajaxGet("/chongwu/selectByZuoqiId", {
		zuoqiId: zuoqiId
	}, function(resp) {
		let list = resp.data;

		if(list.length > 0) {
			for(let i = 0; i < list.length; i++) {
				let data = list[i];

				$("#chongwu_" + data.location).attr({
					"alt": data.name,
					"src": data.image,
					"title": data.name
				});
			}
		}
	}, error);
}

/**
 * 坐骑统御
 * @param zuoqiId 坐骑ID
 * @param chongwuId 宠物ID
 * @param tongyuStatus 统御状态
 */
function tongyu(zuoqiId, chongwuId, tongyuStatus) {
	ajaxPost("/chongwu/tongyu", {
		zuoqiId: zuoqiId,
		chongwuId: chongwuId,
		location: chongwu_location,
		tongyuStatus: tongyuStatus
	}, function(resp) {
		showMsg(resp.message);
		loadChongwu(zuoqiId);

		$("#chongwu_list").datalist("reload").datalist("unselectAll");
	}, error);
}

/**
 * 更换统御
 * @param zuoqiId 坐骑id
 * @param chongwuId 宠物id
 * @param tongyuStatus 统御状态
 */
function change(zuoqiId, chongwuId, tongyuStatus) {
	ajaxPost("/chongwu/change", {
		zuoqiId: zuoqiId,
		chongwuId: chongwuId,
		tongyuStatus: tongyuStatus
	}, function(resp) {
		showMsg(resp.message);
		loadChongwu(zuoqiId);

		$("#chongwu_list").datalist("reload").datalist("unselectAll");
	}, error);
}

/**
 * 点击坐骑详情对话框的【骑乘】按钮
 */
function take() {
	unopen();
}

$(document).ready(function() {

	$("#role_id").combobox({
		url: "/role_account/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		panelHeight: "auto",
		prompt: "-归属角色-",
		formatter: function(row) {
			ajaxGet("/role_category/selectById", {
				id: row.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#role_modeling_" + row.id).attr({
					"title": data.name,
					"src": data.image
				});
			}, error);

			return "<img height='18' id='role_modeling_" + row.id + "' />&ensp;" + row.name;
		}
	});

	$("#category_id").combobox({
		url: "/zuoqi_category/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		editable: true,
		panelHeight: "auto",
		prompt: "-坐骑类型-",
		formatter: function(row) {
			return "<img width='18' src='" + row.image + "' />&nbsp;" + row.name;
		}
	});

	$("#search").linkbutton({
		iconCls: "icon-search"
	}).on("click", function() {
		let categoryId = $("#category_id").combobox("getValue");
		let roleId = $("#role_id").combobox("getValue");

		$("#zuoqi_list").datagrid("reload", {
			categoryId: categoryId,
			roleId: roleId
		});
	});

	$("#clear").linkbutton({
		iconCls: "icon-delete"
	}).on("click", function() {
		$("#search_form").form("clear");
	});

	/******************************************************************************************************/

	/**
	 * 坐骑类型
	 */
	$("#categoryId").combobox({
		url: "/zuoqi_category/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		editable: true,
		required: true,
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='18' src='" + row.image + "' />&nbsp;" + row.name;
		},
		onSelect: function(record)  {
			let name = $("#name").textbox("getValue");

			if (!name) {
				$('#name').textbox("setValue", record.name);
			}
		}
	});

	/**
	 * 坐骑名称
	 */
	$("#name").textbox({
		width: 150,
		required: true
	});

	fetchSelect("#openStatus", stateArray, {
		width: 150,
		required: true
	});

	/**
	 * 角色
	 */
	$("#roleId").combobox({
		url: "/role_account/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		required: true,
		panelHeight: "auto",
		formatter: function(row) {
			ajaxGet("/role_category/selectById", {
				id: row.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#role_" + row.id).attr({
					"title": data.name,
					"src": data.image
				});
			}, error);

			return "<img height='18' id='role_" + row.id + "' />&ensp;" + row.name;
		}
	});

	$("#zuoqi_dialog").dialog({
		title: "坐骑信息",
		width: 500,
		height: 300,
		buttons: [{
			iconCls: "icon-save",
			text: "保存",
			handler: function() {
				let selector = "#zuoqi_form";

				checkForm(selector, function () {
					let data = $(selector).serialize();

					ajaxPost(requestUrl, data, function(resp) {
						showMsg(resp.message);

						$(selector).form("clear");
						$("#zuoqi_dialog").dialog("close");
						$("#zuoqi_list").datagrid("reload");
					}, error);
				});
			}
		}, {
			iconCls: "icon-cancel",
			text: "取消",
			handler: function() {
				$("#zuoqi_dialog").dialog("close");
				$("#zuoqi_form").form("clear");
			}
		}]
	});

	/******************************************************************************************************/

	/**
	 * 标签页
	 */
	$("#tabs").tabs({
		fit: true,
		pill: true,
		border: false,
		narrow: false,
		justified: true,
		closable: false,
		showHeader: true
	});

	/**
	 * 坐骑数据列表
	 */
	$("#zuoqi_datalist").datalist({
		url: "/zuoqi/selectAll",
		width: 238,
		height: 348,
		idField: "id",
		textField: "categoryId",
		textFormatter: function(value, rowData, rowIndex) {
			ajaxGet("/zuoqi_category/selectById", {
				id: rowData.categoryId
			}, function(resp) {
				let data = resp.data;

				$("#zuoqi_" + rowData.id).attr({
					src: data.image,
					title: rowData.name
				});
			}, error);

			return "<img height='72' id='zuoqi_" + rowData.id + "' />";
		},
		onSelect: function(rowIndex, rowData) {
			if(rowData) {
				$("#zuoqi_name").html(rowData.name);

				// 查询坐骑类型
				ajaxGet("/zuoqi_category/selectById", {
					id: rowData.categoryId
				}, function(resp) {
					let data = resp.data;

					$("#zuoqi_image").attr("src", data.image);
				}, error);

				let zuoqiId = rowData.id;

				loadWenshi(zuoqiId);
				loadSkill(zuoqiId);
				loadChongwu(zuoqiId);
			}
		}
	});

	/**
	 * 点击坐骑详情对话框的纹饰格子
	 */
	for (let i = 1; i <= 3; i++) {
		$("#wenshi_" + i).on("click", function() {
			let image = $(this).attr("src");

			if (image && image !== url) {
				// 得到并设置纹饰id
				wenshiId = $(this).attr("ref");

				ajaxGet("/wenshi/selectDetail", {
					wenshiId: wenshiId
				}, function(resp) {
					let result = resp.data;

					$("#wenshi_image").attr("src", result.image);
					$("#wenshi_name").html(result.name);
					$("#wenshi_attribute").empty();

					ajaxGet("/wenshi_attribute/selectAttributes", {
						wenshiId: wenshiId
					}, function(resp) {
						let data = resp.data;
						let html = "";

						for(let i = 0; i < data.length; i++) {
							html += "&emsp;<span>" + data[i] + "</span><br />"
						}

						$("#wenshi_attribute").append(html);
					}, error);

					$("#wenshi_durability").html(result.durability);

					$("#wenshi_inlay").linkbutton({
						text: inlayArray[result.inlayStatus]
					});

					$("#wenshi_detail").dialog("open");
				}, error);
			} else {
				wenshiId = null;

				$("#wenshi_list").datalist("reload");
				$("#wenshi_dialog").dialog("open");
			}

			wenshi_location = i;
		});
	}

	$("#panel").panel({
		title: "",
		width: 226,
		height: 276
	});

	/**
	 * 点击坐骑统御的宠物
	 */
	for (let i = 1; i <= 2; i++) {
		$("#chongwu_" + i).on("click", function() {
			let rowData = $("#zuoqi_datalist").datalist("getSelected");

			if(rowData) {
				// 加载同一角色的宠物
				$("#chongwu_list").datalist("reload", {
					roleId: rowData.roleId
				});

				$("#chongwu_dialog").dialog("open");

				chongwu_location = i;
			} else {
				alertMsg("请选择坐骑！");
			}
		});
	}

	/**
	 * 坐骑详情
	 */
	$("#zuoqi_detail").dialog({
		title: "坐骑详情"
	});

	/******************************************************************************************************/

	/**
	 * 纹饰类型
	 */
	$("#wenshi_category").combobox({
		url: "/wenshi_category/selectAll",
		valueField: "id",
		textField: "name",
		width: 150,
		panelHeight: "auto",
		formatter: function(row) {
			return "<img width='18' src='" + row.image + "' />&nbsp;" + row.name;
		},
		onSelect: function(record) {
			if(record) {
				$("#wenshi_list").datalist("reload", {
					categoryId: record.id
				});
			}
		}
	});

	/**
	 * 纹饰列表
	 */
	$("#wenshi_list").datalist({
		url: "/wenshi/selectDetails",
		width: 200,
		height: 310,
		idField: "id",
		valueField: "id",
		textFormatter: function(value, rowData, rowIndex) {
			return "<img width='50' src='" + rowData.image + "' />";
		},
		onSelect: function(rowIndex, rowData) {
			if(rowData) {
				$("#wenshi_attribute").empty();
				$("#wenshi_image").attr("src", rowData.image);
				$("#wenshi_name").html(rowData.name);

				ajaxGet("/wenshi_attribute/selectAttributes", {
					wenshiId: rowData.id
				}, function(resp) {
					let data = resp.data;
					let html = "";

					for(let i = 0; i < data.length; i++) {
						html += "&emsp;<span>" + data[i] + "</span><br />"
					}

					$("#wenshi_attribute").append(html);
				}, error);

				$("#wenshi_durability").html(rowData.durability);

				$("#wenshi_inlay").linkbutton({
					text: inlayArray[rowData.inlayStatus]
				});

				$("#wenshi_detail").dialog("open");
			}
		}
	});

	/**
	 * 纹饰镶嵌对话框
	 */
	$("#wenshi_dialog").dialog({
		title: " ",
		modal: false
	});

	/******************************************************************************************************/

	/**
	 * 坐骑详情对话框的【骑乘】按钮
	 */
	$("#take").linkbutton({
		text: takeArray[0]
	}).on("click", function() {
		unopen();
	});

	/**
	 * 点击纹饰详情对话框的镶嵌/取下按钮
	 */
	$("#wenshi_inlay").linkbutton({
		text: inlayArray[0]
	}).on("click", function() {
		let zuoqi = $("#zuoqi_datalist").datalist("getSelected");
		let wenshi = $("#wenshi_list").datalist("getSelected");

		let zuoqiId = zuoqi.id;

		ajaxPost("/wenshi/inlay", {
			zuoqiId: zuoqiId,
			location: wenshi_location,
			wenshiId: wenshiId ? wenshiId : wenshi.id,
			inlayStatus: wenshiId ? 1 : wenshi.inlayStatus
		}, function(resp) {
			showMsg(resp.message);

			$("#wenshi_list").datalist("reload");
			$("#wenshi_detail").dialog("close");

			loadBeforeView(zuoqiId);
		}, error);
	});

	/**
	 * 纹饰详情对话框
	 */
	$("#wenshi_detail").dialog({
		title: " ",
		width: 220
	});

	/******************************************************************************************************/

	/**
	 * 宠物列表
	 */
	$("#chongwu_list").datalist({
		url: "/chongwu/selectByRoleId",
		idField: "id",
		textField: "name",
		width: 238,
		height: 348,
		textFormatter: function(value, rowData, rowIndex) {
			let html = "";

			html += "<table style='border-spacing:0;'>";
			html += 	"<tr>";
			html += 		"<td rowspan=3>";
			html += 			"<div style='width:82px;height:82px;'>";
			html += 				"<img width='80' id='chongwu_image_" + rowIndex + "' />";
			html += 			"</div>";
			html += 		"</td>";

			html += 		"<td>";
			html += 			"<span>" + rowData.name + "</span>";
			html += 		"</td>";
			html += 	"</tr>";

			html += 	"<tr>";
			html += 		"<td>";
			html += 			"<div id='ty_zuoqi_" + rowData.id + "'></div>";
			html += 		"</td>";
			html += 	"</tr>";

			html += 	"<tr>";
			html += 		"<td>";
			html += 			"<div id='tags_" + rowIndex + "'>";
			html += 				"<button>攻宠</button>";
			html += 				"<button>法宠</button>";
			html += 			"</div>";
			html += 		"</td>";
			html += 	"</tr>";
			html += "</table>";

			ajaxGet("/chongwu_category/selectById", {
				id: rowData.categoryId
			}, function(resp) {
				let data = resp.data;
				
				$("#chongwu_image_" + rowIndex).attr("src", data.image);

				// 得到宠物的统御状态
				let tongyuStatus = rowData.tongyuStatus;

				if(tongyuStatus === 1) {
					ajaxGet("/zuoqi_chongwu/selectByChongwuId", {
						chongwuId: rowData.id
					}, function(resp) {
						let data = resp.data;
						let zuoqiId = data.zuoqiId;

						ajaxGet("/zuoqi_skill/selectByZuoqiId", {
							zuoqiId: zuoqiId
						}, function(resp) {
							let data = resp.data;

							if(data && data.skillId) {
								ajaxGet("/zuoqi_skill_category/selectById", {
									id: data.skillId
								}, function(resp) {
									let data = resp.data;

									ajaxGet("/zuoqi/selectById", {
										id: zuoqiId
									}, function(resp) {
										let zuoqi = resp.data;
										let content = "";

										content += "<img height='16' src='" + data.image + "' />";
										content += "<span class='green'>" + zuoqi.name + "</span>";

										$("#ty_zuoqi_" + rowData.id).html(content);
									}, error);
								}, error);
							} else {
								ajaxGet("/zuoqi/selectById", {
									id: zuoqiId
								}, function(resp) {
									let content = "<span class='green'>" + resp.data.name + "</span>";

									$("#ty_zuoqi_" + rowData.id).html(content);
								}, error);
							}
						}, error);
					}, error);
				} else {
					let content = "<span>" + states[tongyuStatus] + "</span>";

					$("#ty_zuoqi_" + rowData.id).html(content);
				}
			}, error);

			return html;
		},
		onSelect: function(rowIndex, rowData) {
			if(rowData) { // 选中宠物
				operation = null;
				
				$('#chongwu_skills').empty();
				$("#chongwu_name").html(rowData.name);
				$("#chongwu_grade").html(rowData.grade);

				let tongyuStatus = rowData.tongyuStatus;

				$("#tongyu").linkbutton({
					text: tongyuArray[tongyuStatus]
				});

				if(tongyuStatus === 0) {
					$("#chongwu_state").html("<span>" + states[tongyuStatus] + "</span>");
				} else {
					let zuoqi = $("#zuoqi_datalist").datalist("getSelected");

					ajaxGet("/zuoqi_chongwu/selectByChongwuId", {
						chongwuId: rowData.id
					}, function(resp) {
						let data = resp.data;

						// 宠物已被统御且统御宠物的坐骑与选中的坐骑不相同
						if (data.zuoqiId !== zuoqi.id) {
							operation = "ghty"; // 操作为：更换统御

							$("#tongyu").linkbutton({
								text: tongyuArray[2]
							});
						}

						ajaxGet("/zuoqi/selectById", {
							id: data.id
						}, function(resp) {
							let data = resp.data;

							$("#chongwu_state").html("<span class='green'>" + data.name +"</span>"
								+ "&ensp;<span class='yello'>统御中</span>");
						}, error);
					}, error);
				}

				ajaxGet("/chongwu_category/selectById", {
					id: rowData.categoryId
				}, function(resp) {
					let data = resp.data;

					$("#chongwu_image").attr("src", data.image);
				}, error);

				ajaxGet("/chongwu_skill/getLearnedSkills", {
					chongwuId: rowData.id
				}, function(resp) {
					let data = resp.data;
					let skills = "<tr>";

					for(let i= 0; i< data.length; i++) {
						let name = data[i].name;
						let type = data[i].type;
						let image = data[i].image;
						let verifiable = data[i].verifiable;
						let authStatus = data[i].authStatus;

						skills += "<td>";

						if(type === 1 && verifiable === 0) {
							skills += "<div class='skill_box skill_blue' title='" + name + "' >";

							skills += "<img src='" + image + "' />";
						} else {
							skills += "<div class='skill_box skill_purple' title='" + name + "' >";

							skills += "<img src='" + image + "' />";

							if(authStatus === 1) {
								skills += "<i></i>";
							}
						}

						skills += "</div></td>";

						if((i+1) % 4 === 0) { // 4个1行
							skills += "</tr><tr>";
						}
					}

					skills += "</tr>";

					$("#chongwu_skills").append(skills);
				}, error);

				$("#chongwu_detail").dialog("open");
			}
		}
	});

	// 宠物列表【统御】按钮
	$("#tongyu").linkbutton({
		text: tongyuArray[0]
	}).on("click", function() {
		let chongwu = $("#chongwu_list").datalist("getSelected");
		let zuoqi = $("#zuoqi_datalist").datalist("getSelected");

		if(!chongwu) {
			alertMsg("请选择宠物");
		} else if(!zuoqi) {
			alertMsg("请选择坐骑");
		} else {
			let zuoqiId = zuoqi.id;
			let chongwuId = chongwu.id;
			let tongyuStatus = chongwu.tongyuStatus;

			if(operation === "ghty") { // 更换统御
				// 通过id查询坐骑名字
				ajaxGet("/zuoqi/selectById", {
					id: chongwu.zuoqiId
				}, function(resp) {
					let message = "召唤灵已被<span class='blue'>" + resp.data.name
						+ "</span>统御<br/>本次操作将会改为由<span class='blue'>"
						+ zuoqi.name + "</span>统御，是否确定？";

					$.messager.confirm("提示", message , function(bool) {
						if(bool) {
							change(zuoqiId, chongwuId, tongyuStatus);
						}
					});
				}, error);
			} else { // 统御/取消统御
				tongyu(zuoqiId, chongwuId, tongyuStatus);
			}
		}
	});

	// 统御宠物对话框
	$("#chongwu_dialog").dialog({
		title: "选择召唤灵"
	});

	/******************************************************************************************************/


	/**
	 * 宠物详情对话框
	 */
	$("#chongwu_detail").dialog({
		title: "宠物详情",
		modal: false,
		width: 264
	});

	/******************************************************************************************************/

	/**
	 * 表格体的高度
	 * @type {number}
	 */
	let heigt_body = heigt_tr_with_role_details * 10;
	/**
	 * 表格高度
	 * @type {number}
	 */
	let height_table = heigt_tool + heigt_header + heigt_body + heigt_footer + heigt_scoll_bar + 2;

	$("#zuoqi_list").datagrid({
		url: "/zuoqi/selectByPage",
		height: height_table,
		rownumbers: true,
		fitColumns: true,
		pagination: true,
		toolbar: [{
			iconCls: "icon-add",
			text: "添加",
			handler: function() {
				addHandler();
			}
		}, "-", {
			iconCls: "icon-edit",
			text: "修改",
			handler: function() {
				editHandler();
			}
		}, "-", {
			iconCls: "icon-delete",
			text: "删除",
			handler: function() {
				deleteHandler();
			}
		}, "-", {
			iconCls: "icon-search",
			text: "预览坐骑",
			handler: function() {
				detailHandler();
			}
		}],
		columns: [[
			{field: "id", hidden: true},
			{field: "categoryId", title: "坐骑类型", align: "center", width: 160
				, formatter: function(value, rowData, rowIndex) {
					ajaxGet("/zuoqi_category/selectById", {
						id: value
					}, function(resp) {
						let data = resp.data;

						$("#zuoqi_category_" + rowIndex).attr({
							title: data.name,
							src: data.image
						});
					}, error);

					return "<img height='" + size + "' id='zuoqi_category_" + rowIndex + "' />";
				}
			},
			{field: "name", title: "坐骑名字", align: "center", width: 160},
			{field: "openStatus", title: "开启状态", align: "center", width: 160
				, formatter: function(value) {
					return "<span>" + stateArray[value] + "</span>";
				}
			},
			roleDetailsColumn
		]]
	});

});